<template>
	<view>
		<view class="herder ">
			<span class="span1">盘点存放地点</span>
			<span>{{address}}</span>
		</view>
		<view class="box">
			<block v-for="(v,i) in treeData">
				<recursive-component :node="v" :inventoryId='inventoryId' />
			</block>
		</view>
		<view class="btn flex justify-content-around">
			<view class="btn_left" @click="back"> 返回</view>
			<view class="btn_right" @click="submit">提交</view>
		</view>
	</view>
</template>

<script>
	import RecursiveComponent from './components/RecursiveComponent.vue';
	import {
		partitionTree,
		inventoryOver
	} from '@/api/Inventory.js'
	export default {
		components: {
			RecursiveComponent
		},
		data() {
			return {
				// 定义一个简单的树形结构数据
				treeData: [],
				inventoryId: '',
				address: '',
				option: {},
				tree: [{
						state: 1,
						children: [{
								state: 1,
								children: []
							},
							{
								state: 0,
								children: []
							}
						]
					},
					{
						state: 1,
						children: [{
							state: 0,
							children: []
						}]
					}
				]
			};
		},
		onLoad(option) {
			this.inventoryId = option.id
			this.address = option.address
			this.option = option
		},
		onShow() {
			this.getTree(this.option.id)
		},
		methods: {
			async getTree(id) {
				uni.showLoading({
					title: "加载中",
					mask: true
				})
				const res = await partitionTree({
					id,
				})
				this.treeData = res.datas
				uni.hideLoading()
				console.log(res, "res");
			},
			//  判断是否有未盘点的
			hasNonZeroState(nodes) {
				for (const node of nodes) {
				    // 如果当前节点的 state 等于 0，返回 true
				    if (node.state === 0) {
				      return true;
				    }
				
				    // 递归检查子节点
				    if (node.children && node.children.length > 0) {
				      if (this.hasNonZeroState(node.children)) {
				        return true; // 如果子节点中有 state 等于 0，返回 true
				      }
				    }
				  }
				
				  return false; // 如果所有节点的 state 都不等于 0，返回 false
			},
			submit() {
				// console.log(this.hasNonZeroState(this.tree));
				if (this.hasNonZeroState(this.treeData)) return uni.$u.toast('还有未盘点的单据')

				uni.showModal({
					title: '确认提交？',
					success: async (showModalRes) => {
						console.log(showModalRes, "res");
						if (showModalRes.confirm) {
							const res = await inventoryOver({
								id: this.inventoryId
							})
							uni.$u.toast('提交成功')
							uni.navigateBack()
						}
					}
				})
			},
			back() {
				uni.navigateBack()
			}
		}
	};
</script>
<style>
	page {
		background-color: #f6f6f6;
	}
</style>
<style lang="scss" scoped>
	.herder {
		background: #fff;
		padding: 30rpx;
		font-size: 28rpx;

		.span1 {
			color: #9c9c9c;
			margin-right: 10rpx;
		}
	}

	.box {
		background-color: #fff;
		margin-top: 15rpx;
		padding: 30rpx 20rpx;
		min-height: 400rpx;
	}

	.btn {
		position: fixed;
		bottom: 0;
		padding: 30rpx;
		background-color: #FFF;
		width: 100%;

		view {
			width: 300rpx;
			text-align: center;
			height: 80rpx;
			line-height: 80rpx;
			border-radius: 8rpx;
		}

		&_left {
			border: 2rpx solid #9c9c9c;
		}

		&_right {
			background-color: #267DFF;
			color: #FFF;
		}
	}
</style>